<i18n locale="en" lang="yaml">
riskWarningTitle: ' '
riskWarningIntro: ' '
riskWarningLaw1 : ' '
riskWarningLaw2 : ' '
riskWarningLaw3 : ' '
</i18n>
<i18n locale="zh-CN" lang="yaml">
Current Script is locked: 当前脚本已被锁定

Show Risk Warning: 显示风险提示
riskWarningTitle : 风险提示
riskWarningIntro : 可能有人可以通过一些特别的办法绕过这个限制<br>但在无论是谁都建议先了解一下相关法律规定：
riskWarningLaw1  : 根据《中华人民共和国刑法》第二百八十六条<span class="text-bad">【破坏计算机信息系统罪】</span>违反国家规定，对计算机信息系统功能进行删除、修改、增加、干扰，造成计算机信息系统不能正常运行，
riskWarningLaw2  : 后果严重的，处<span class="text-bad">五年以下</span>有期徒刑或者拘役；
riskWarningLaw3  : 后果特别严重的，处<span class="text-bad">五年以上</span>有期徒刑。
</i18n>

<!-- Generated by OpenCC START -->
<i18n locale="zh-HK" lang="yaml">
Current Script is locked: 當前腳本已被鎖定
Show Risk Warning: 顯示風險提示
riskWarningIntro: 可能有人可以通過一些特別的辦法繞過這個限制<br>但在無論是誰都建議先了解一下相關法律規定：
riskWarningLaw1: 根據《中華人民共和國刑法》第二百八十六條<span class="text-bad">【破壞計算機信息系統罪】</span>違反國家規定，對計算機信息系統功能進行刪除、修改、增加、干擾，造成計算機信息系統不能正常運行，
riskWarningLaw2: 後果嚴重的，處<span class="text-bad">五年以下</span>有期徒刑或者拘役；
riskWarningLaw3: 後果特別嚴重的，處<span class="text-bad">五年以上</span>有期徒刑。
riskWarningTitle: 風險提示
</i18n>
<i18n locale="zh-TW" lang="yaml">
Current Script is locked: 當前指令碼已被鎖定
Show Risk Warning: 顯示風險提示
riskWarningIntro: 可能有人可以透過一些特別的辦法繞過這個限制<br>但在無論是誰都建議先了解一下相關法律規定：
riskWarningLaw1: 根據《中華人民共和國刑法》第二百八十六條<span class="text-bad">【破壞計算機資訊系統罪】</span>違反國家規定，對計算機資訊系統功能進行刪除、修改、增加、干擾，造成計算機資訊系統不能正常執行，
riskWarningLaw2: 後果嚴重的，處<span class="text-bad">五年以下</span>有期徒刑或者拘役；
riskWarningLaw3: 後果特別嚴重的，處<span class="text-bad">五年以上</span>有期徒刑。
riskWarningTitle: 風險提示
</i18n>
<!-- Generated by OpenCC END -->

<template>
  <transition name="fade">
    <el-container direction="vertical" v-show="$store.state.isLoaded">
      <!-- Main content -->
      <el-main>
        <div class="lock-notice-area">
          <h1 class="lock-notice-title"><fa class="fa fa-fw fa-eye-slash"></fa>{{ $t('Current Script is locked') }}</h1>

          <br>
          <template v-if="T.notNothing($t('riskWarningIntro'))">
            <template v-if="showRiskWarning">
              <h1 class="risk-warning-title">{{ $t('riskWarningTitle') }}</h1>
              <p class="risk-warning-intro" v-html="$t('riskWarningIntro')"></p>
              <p class="risk-warning-law">
                &#12288;&#12288;<span v-html="$t('riskWarningLaw1')"></span>
                <br>&#12288;&#12288;<span v-html="$t('riskWarningLaw2')"></span>
                <br>&#12288;&#12288;<span v-html="$t('riskWarningLaw3')"></span>
              </p>
            </template>
            <el-link type="primary" v-else @click="showRiskWarning = true">{{ $t('Show Risk Warning') }} ⋙</el-link>
          </template>
        </div>
      </el-main>
    </el-container>
  </transition>
</template>

<script>
export default {
  name: 'ScriptLocked',
  components: {
  },
  watch: {
  },
  methods: {
  },
  computed: {
  },
  props: {
  },
  data() {
    return {
      showRiskWarning: false
    }
  },
  created() {
    this.$store.commit('updateLoadStatus', true);
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.lock-notice-area {
  width: 700px;
  padding-top: 30px;
  padding-left: 20px;
  text-align: center;
}
.lock-notice-title {
  color: darkgrey !important;
  font-size: x-large;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.lock-notice-title .fa {
  margin-bottom: 20px;
  font-size: 50px;
}
.risk-warning-title {
  color: red !important;
}
.risk-warning-intro,
.risk-warning-law {
  color: darkgrey !important;
  line-height: 2;
}
.risk-warning-law {
  text-align: left;
}
</style>

<style>
</style>
